<template>
    <div class="messageDetail" style="padding: 20px;">
        <el-form ref="form" :model="formData" label-width="150px">
            <el-form-item label="申请人资质条件">
                <el-select style="width: 100%;" allow-create multiple v-model="formData.personCondition" clearable
                    placeholder="请选择申请人资质条件" filterable>
                    <el-option v-for="item in person_condition" :key="item.value" :label="item.label"
                        :value="item.value"></el-option>
                </el-select>
            </el-form-item>
            <el-form-item label="经营规模">
                <el-select style="width: 100%;" allow-create multiple v-model="formData.scaleOperation" clearable
                    placeholder="请选择经营规模" filterable>
                    <el-option v-for="item in business_scale" :key="item.value" :label="item.label"
                        :value="item.value"></el-option>
                </el-select>
            </el-form-item>
            <el-form-item label="经营条件">
                <el-select style="width: 100%;" allow-create multiple v-model="formData.mangeCont" clearable
                    placeholder="请选择经营规模" filterable>
                    <el-option v-for="item in mange_cont" :key="item.value" :label="item.label"
                        :value="item.value"></el-option>
                </el-select>
            </el-form-item>
            <el-form-item label="企业贷款笔数">
                <el-input type="number" min="0" v-model="formData.enterLoanCount" placeholder="请输入企业贷款笔数"></el-input>
            </el-form-item>
            <el-form-item label="企业贷款机构数">
                <el-input type="number" min="0" v-model="formData.enterLoanMechCount"
                    placeholder="请输入企业贷款机构"></el-input>
            </el-form-item>
            <el-form-item label="资产负债率">
                <el-input type="number" min="0" v-model="formData.assetDeptRate" placeholder="请输入资产负债率，例如30% 填写30即可">
                    <i slot="suffix">%</i>
                </el-input>
            </el-form-item>
            <el-form-item label="手机号在网时长">
                <el-input type="number" min="0" v-model="formData.phoneOnline" placeholder="请输入手机号在网时长"></el-input>
            </el-form-item>
            <el-form-item label="手机号是否实名认证">
                <el-radio-group v-model="formData.phoneReal">
                    <el-radio label='1'>是</el-radio>
                    <el-radio label='0'>否</el-radio>
                </el-radio-group>
            </el-form-item>

            <el-form-item label="公积金缴纳">
                <el-input v-model="formData.reserveFundMonth" type="number" min='0' oninput="if(value<0)value=0">
                    <i slot="suffix">月</i>
                </el-input>
            </el-form-item>
            <el-form-item label="社保缴纳">
                <el-input v-model="formData.socialSecurityMonth" type="number" min='0' oninput="if(value<0)value=0">
                    <i slot="suffix">月</i>
                </el-input>
            </el-form-item>

            <el-form-item label="资产证明">
                <el-select multiple style="width: 100%" v-model="formData.assets" clearable allow-create
                    placeholder="请选择资产证明" filterable>
                    <el-option v-for="(item, index) in asset_proof" :key="index" :label="item.dictLabel"
                        :value="item.dictValue"></el-option>
                </el-select>
            </el-form-item>
            <el-form-item label="证书专利">
                <el-select multiple style="width: 100%" v-model="formData.certificate" placeholder="请选择证件类型" filterable>
                    <el-option v-for="(item, index) in certificate_patent" :key="index" :label="item.dictLabel"
                        :value="item.dictValue"></el-option>
                </el-select>
            </el-form-item>
            <el-form-item label="客服沟通结果：">
            </el-form-item>
            <el-form-item label="沟通标签">
                <el-radio-group v-model="formData.customerTag">
                    <el-radio label="1">关机</el-radio>
                    <el-radio label="2">不需要</el-radio>
                    <el-radio label="3">需要回拨</el-radio>
                    <el-radio label="4">停机</el-radio>
                    <el-radio label="5">不方便接</el-radio>
                    <el-radio label="6">沟通成功</el-radio>
                </el-radio-group>
            </el-form-item>
            <el-form-item label="客户情况">
                <el-input type="textarea" v-model="formData.clientStatus" maxlength="200" show-word-limit></el-input>
            </el-form-item>
            <el-form-item label="备注">
                <el-input type="textarea" v-model="formData.remark" maxlength="200" show-word-limit></el-input>
            </el-form-item>
            <el-form-item>
                <el-button style="width: 100px;" type="primary" @click="onSubmit">保存</el-button>
            </el-form-item>
        </el-form>
    </div>
</template>

<script>
import { getDictData } from '@/utils/dict'
import { saveCreditCustomerRecord, getCreditCustomerRecord } from '@/api/customer'
export default {
    props: {
        id: {
            type: String,
            default: '',
        },
    },
    data() {
        return {
            formData: {
                personCondition: [], //申请人资质条件
                scaleOperation: [], //经营规模
                mangeCont: [], ///经营条件
                enterLoanCount: undefined, //企业贷款笔数
                enterLoanMechCount: undefined, //企业贷款机构
                assetDeptRate: undefined, //资产负债率
                phoneOnline: undefined,//手机号在网时长
                phoneReal: undefined,//手机号实名认证
                reserveFundMonth: undefined,//公积金缴纳
                socialSecurityMonth: undefined,//社保缴纳
                assets: [], //资产证明
                certificate: [], //证书专利
                customerTag: undefined, //沟通标签
                clientStatus: undefined, //客户情况
                remark: undefined, //备注
            },
            person_condition: [],
            business_scale: [],
            mange_cont: [],
            asset_proof: [],
            certificate_patent: [],


            listArr: ['person_condition', 'business_scale', 'mange_cont', 'asset_proof', 'certificate_patent']
        }
    },
    methods: {

        getInfo() {
            getCreditCustomerRecord(this.id).then(res => {
                console.log(res);
                let obj = res.data;
                obj.personCondition = obj.personCondition.split(',');
                obj.mangeCont = obj.mangeCont.split(',');
                obj.scaleOperation = obj.scaleOperation.split(',');
                obj.assets = obj.assets.split(',');
                obj.certificate = obj.certificate.split(',');
                this.formData = Object.assign({}, obj);
            })
        },
        init() {
            this.listArr.forEach(async item => {
                const res = await getDictData(item)
                this[item] = res
            })
            this.getInfo()
        },
        onSubmit() {
            this.$refs.form.validate(async valid => {
                let obj = {
                    ...this.formData,
                    enterpriseId: this.id || undefined
                }
                console.log(obj);
                // return 
                obj.personCondition = obj.personCondition.join(',')
                obj.scaleOperation = obj.scaleOperation.join(',')
                obj.mangeCont = obj.mangeCont.join(',')
                obj.assets = obj.assets.join(',')
                obj.certificate = obj.certificate.join(',')
                console.log(this.formData);
                saveCreditCustomerRecord(obj).then(res => {
                    this.$message.success('保存成功')
                })
            })
        }
    },
    created() {
        this.init()
    },
}
</script>